<template>
  <div class="ind-model-list-index">
    <div class="header sub-margin">
      <div class="sub-page-title">
        平台设置
        <div id="guide-step-6" class="guide-step">
          <el-button type="info" size="small" class="add-btn" @click.stop="cancleSet">取消</el-button>
          <el-button type="primary" size="small" class="add-btn" @click.stop="saveSet">保存设置</el-button>
        </div>
      </div>
    </div>
    <div class="content">
      <template v-if="!showEmpty">
        <div class="right-con">
          <el-form ref="platForm" :model="platForm" :rules="rules" label-width="100px" size="medium" class="role-form">
            <el-form-item label="系统名称：">
              <el-input
                size="small"
                v-model="systemName"
                maxlength="10"
                placeholder="请输入系统名称"
                style="width: 50%"></el-input>
              <el-input size="small" v-model="systemNameSuffix" readonly></el-input>
            </el-form-item>
            <el-form-item label="企业logo：">
              <UploadFile
                :fileList.sync="systemIcon"
                accept=".jpeg,.png,.jpg,.svg,"
                :maxLimit="1"
                layout="block"></UploadFile>
              <div class="img-tip">建议 logo 尺寸：400*80；最佳适配颜色为白色</div>
            </el-form-item>
            <el-form-item label="系统背景图：">
              <UploadFile
                :fileList.sync="systemBackground"
                accept=".jpeg,.png,.jpg,"
                :maxLimit="3"
                layout="block"></UploadFile>
              <div class="img-tip">建议系统背景图尺寸：1980*750</div>
            </el-form-item>
          </el-form>
        </div>
      </template>
      <Empty v-else-if="!loading">
        <div class="tip-txt">
          <p>还没有考核方案</p>
        </div>
      </Empty>
    </div>
  </div>
</template>

<script>
import { getBaseConfig, saveBaseConfig } from '@apis/assessManage.js'
import { IND_TYPE } from '@utility/dict'
import Empty from './components/Empty.vue'
import UploadFile from '@com/UploadFile'
export default {
  name: 'IndModelListIndex',
  components: { Empty, UploadFile },
  props: {},
  data() {
    return {
      platForm: {
        roleName: '',
        roleCode: '',
        remark: '',
        createTime: '',
      },
      rules: {
        roleName: [{ required: true, message: '请输入角色名称', trigger: 'blur' }],
        roleCode: [{ required: true, message: '请输入角色编码', trigger: 'blur' }],
      },
      loaded: true,
      showEmpty: false,
      systemName: '',
      systemNameSuffix: '平时考核系统',
      systemIcon: [],
      systemBackground: [],
      formData: {},
    }
  },
  computed: {
    isLznl() {
      return this.indType === IND_TYPE.lznl
    },
    isEmpty() {
      return true
      // return this.totalSize === 0 && this.conditions.modelName === '' && this.conditions.status === ''
    },
  },
  watch: {},
  created() {
    this.initData()
  },
  mounted() {},
  methods: {
    initData() {
      getBaseConfig()
        .then(res => {
          this.loaded = true
          const { data } = res
          this.formData = data
          // 系统图标
          if (data.systemIcon) {
            this.systemIcon = JSON.parse(data.systemIcon)
          }
          // 系统背景图
          if (data.systemBackground.length) {
            const arr = []
            data.systemBackground.forEach(item => {
              arr.push(JSON.parse(item))
            })
            this.systemBackground = arr
          }
          this.systemName = data.platformName.slice(0, -6)
        })
        .catch(() => {
          this.loaded = true
        })
    },
    cancleSet() {
      this.conditions = {
        keyword: '',
        contentType: '',
        state: '',
        isRotation: '',
      }
    },
    saveSet() {
      const backgroundImg = []
      this.systemBackground.forEach(item => {
        backgroundImg.push(JSON.stringify(item))
      })
      const param = {
        systemIcon: JSON.stringify(this.systemIcon),
        systemBackground: backgroundImg,
        tenantId: this.formData.tenantId,
        platformName: this.systemName + this.systemNameSuffix,
      }
      saveBaseConfig(param).then(res => {
        if (res.status === 200) {
          this.$message.success('保存成功')
        }
      })
    },
    onFileChange(data) {
      console.log('data :>> ', data)
      console.log('this.systemIcon :>> ', this.systemIcon)
    },
  },
}
</script>
<style lang="scss" scoped>
@import '@styles/layout.scss';

.ind-model-list-index {
  height: 100%;
  display: flex;
  flex-direction: column;
  padding-bottom: 15px;

  .sub-page-title {
    position: relative;

    .guide-step {
      position: absolute;
      right: 0;
      bottom: 10px;
      padding: 0;
    }
  }

  .content {
    flex: 1;
    padding: 20px 0;
    .right-con {
      padding: 0 50px;
      /deep/.el-input {
        width: auto;
      }
      .img-tip {
        color: #d9001b;
      }
    }
    .el-form-item {
      max-width: 600px;

      .input {
        width: 100%;
      }
    }
  }
}
</style>
